<style lang="less">
  .item1{
    height: 42px;
    line-height: 40px;
  }
  .row-left{
    text-align: center;
  }
  .title-top{
    margin-bottom:10px;
    color: #1C86EE;
    font-size: 1rem;
    border-bottom: 1px solid orangered;
    font-size: 20px;
    color: coral;
  }
  .navi-title {
    height:30px;
    background-color:#f8f8f9;
    line-height:30px;
    padding-left: 15px;
    color: #5CACEE;
    font-size: 0.7rem;
    font-weight: bold;
  }
  .content{
    background-color:white;
    height: auto;
    border: 1px solid lightgray;
    padding: 0px;
  }
  .idCard{
    width: 170px;
    height: 80px;
    background-color: #79e428;
    position: absolute;
    right: 2%;
    top: 13%;
    color: white;
    font-size: 1.5rem;
    line-height: 80px;
    text-align: center;
  }
  .red-name{
    color: red
  }
  .ivu-steps-item {
    display: initial;
    position: relative;
    vertical-align: initial;
  }
  .step-item {
    float: left;
    margin-left: 0px;
  }
</style>
<template>
  <div style="background-color:white">
    <div style="">
      <Row class="title-top">
        <Col span="4" style="text-align: left;width:22%">城市低保救助申请登记</Col>
      </Row>
    </div>
    <div style="height:30px;">
      <Steps :current="5" size="small">
        <div @click="nextStep('0')" class="step-item">
          <Step title="家庭信息" content=""></Step>
        </div>
        <div @click="nextStep('1')" class="step-item">
          <Step title="家庭成员" content=""></Step>
        </div>
        <div @click="nextStep('2')" class="step-item">
          <Step title="基础收入" content=""></Step>
        </div>
        <div @click="nextStep('3')" class="step-item">
          <Step title="基础支出" content=""></Step>
        </div>
        <div @click="nextStep('4')" class="step-item">
          <Step title="赡抚扶养" content=""></Step>
        </div>
        <div @click="nextStep('5')" class="step-item">
          <Step title="基础财产" content=""></Step>
        </div>
        <div @click="nextStep('6')" class="step-item">
          <Step title="财产房产" content=""></Step>
        </div>
        <div @click="nextStep('7')" class="step-item">
          <Step title="工作单位" content=""></Step>
        </div>
        <div @click="nextStep('8')" class="step-item">
          <Step title="教育情况" content=""></Step>
        </div>
        <div @click="nextStep('9')" class="step-item">
          <Step title="家庭附件" content=""></Step>
        </div>
        <div @click="nextStep('10')" class="step-item">
          <Step title="提交信息" content=""></Step>
        </div>
      </Steps>
    </div>
    <div class="content">
      <div class="navi-title">
        基础财产信息
      </div>
      <div style="height:30px;margin-top:3px">
        <Button type="info" class="step-item" style="margin-left:5px" size="small" @click="entry()">录入</Button>
        <Modal v-model="modal" title="录入基础财产" width="900" style="position:relative;">
          <Form ref="paramData" :model="paramData" :rules="ruleValidate">
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">人员姓名:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbd0001">
                  <Option :value="obj.id" v-for="obj in dataF1" v-bind:key="obj.key">{{obj.azcp0003}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="red-name">财产类型:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbd0002">
                  <Option :value="obj.key" v-for="obj in data2.PossessionTypeDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">财产名称:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbd0003" placeholder=""></Input>
              </Col>
              <Col span="5" style="text-align: center" class="red-name">财产数量:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbd0004" placeholder=""></Input>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">财产总估值:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbd0005" placeholder=""></Input>
              </Col>
              <Col span="5" style="text-align: center" class="red-name">是否计入个人收入:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbd0006">
                  <Option :value="obj.key" v-for="obj in data2.YesOrNoDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">计入开始时间:</Col>
              <Col span="6">
                <DatePicker type="date" v-model="paramData.ssbd0009" placeholder="Select date" style="width: 217px"></DatePicker>
              </Col>
              <Col span="5" style="text-align: center" class="">计入月数:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbd0008" placeholder=""></Input>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">计入结束时间:</Col>
              <Col span="6">
                <DatePicker type="date" v-model="paramData.ssbd0010" placeholder="Select date" style="width: 217px"></DatePicker>
              </Col>
              <Col span="5" style="text-align: center" class="">月计入个人收入金额:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbd0007" placeholder=""></Input>
              </Col>
            </Row>
          </Form>
          <div slot="footer">
            <Button type="text" size="large" @click="modal = false">取消</Button>
            <Button type="primary" size="large" :disabled="order_state == '1' || order_state == '2' || order_state == '3'" @click="ok111(paramData)">确定</Button>
          </div>
        </Modal>
        <!-- <Button type="info" class="step-itemoption" style="margin-left:5px">查看</Button> -->
      </div>
      <div>
        <Table :columns="columns1" :data="data3">
          <template slot-scope="{ row, index, column }" slot="action">
              <Button type="info" size="small" :disabled="order_state == '1' || order_state == '2' || order_state == '3'"  @click="edit(index)" style="margin-right:5px">编辑</Button>
              <Button type="error" size="small" :disabled="order_state == '1' || order_state == '2' || order_state == '3'"  @click="deletePeople(index)">删除</Button>
          </template>
        </Table>
        <div style="margin: 10px;overflow: hidden">
        <div style="float: right;">
            <Page :total="data3.length" :current="1" @on-change="changePage"></Page>
        </div>
    </div>
      </div>
    </div>
    <div style="height:40px;line-height:40px;float:left;margin-top:10px;margin-left:40%">
      <Button type="info" :disabled="order_state == '1' || order_state == '2' || order_state == '3'" @click="next()" style="margin-right:5px">下一步></Button>
      <Button type="info" @click="nextPage()" v-if="order_state == '1' || order_state == '2' || order_state == '3'">下一页></Button>
    </div>
  </div>
</template>
<script>
import { getAppraising, createPostNew, findFamilyList, date2str } from '@/api/eventlist'
export default {
  data () {
    return {
      family_url: '',
      support_id: '',
      family_idInfo: {},
      next_params: {},
      itemid: this.$route.params.itemid || '',
      property_url: '',
      info_url: '',
      add_url: '',
      update_url: '',
      delete_url: '',
      see: this.$route.params.see || false,
      code: this.$route.params.code,
      url: 'dbsq/addPropertyInfo',
      str: this.$route.params.serialNumber,
      idcardNumber: this.$route.params.idcardNumber,
      ss11001Id: this.$route.params.ss11001Id,
      ss11002Id: this.$route.params.ss11002Id,
      errorTitle: '保存错误',
      columns1: [
        {
          title: '人员姓名',
          key: 'azcp0003'
        },
        {
          title: '财产类型',
          key: 'ssbd0002'
        },
        {
          title: '财产名称 ',
          key: 'ssbd0003'
        },
        {
          title: '财产数量',
          key: 'ssbd0004'
        },
        {
          title: '财产总估值',
          key: 'ssbd0005'
        },
        {
          title: '是否计入个人收入',
          key: 'ssbd0006'
        },
        {
          title: '计入开始时间',
          key: 'ssbd0009'
        },
        {
          title: '计入结束时间',
          key: 'ssbd0010'
        },
        {
          title: '计入月数',
          key: 'ssbd0008'
        },
        {
          title: '月计入个人收入金额',
          key: 'ssbd0007'
        },
        {
          title: '操作',
          slot: 'action'
        }
      ],
      paramData: {
        ssbd0001: '',
        ssbd0002: '',
        ssbd0003: '',
        ssbd0004: '',
        ssbd0005: '',
        ssbd0006: '',
        ssbd0007: '',
        ssbd0008: '',
        ssbd0009: '',
        ssbd0010: ''
      },
      ruleValidate: {
        name: [
          { required: true, message: 'The name cannot be empty', trigger: 'blur' }
        ]
      },
      data1: [],
      data2: [],
      data3: [],
      dataF1: [],
      dataF2: [
        {
          'key': '1',
          'value': '家庭支出'
        }
      ],
      modal: false,
      order_state: this.$route.params.order_state
    }
  },
  methods: {
    nextStep (step) {
      if (step === '0') {
        this.$router.push({
          name: 'subsistenceapplication',
          params: this.next_params
        })
      } else if (step === '1') {
        this.$router.push({
          name: 'subsistenceapplication1',
          params: this.next_params
        })
      } else if (step === '2') {
        this.$router.push({
          name: 'subsistenceapplication2',
          params: this.next_params
        })
      } else if (step === '3') {
        this.$router.push({
          name: 'expenditurelist',
          params: this.next_params
        })
      } else if (step === '4') {
        this.$router.push({
          name: 'supportlist',
          params: this.next_params
        })
      } else if (step === '6') {
        this.$router.push({
          name: 'houseproperty',
          params: this.next_params
        })
      } else if (step === '7') {
        this.$router.push({
          name: 'workunit',
          params: this.next_params
        })
      } else if (step === '8') {
        this.$router.push({
          name: 'educationinfo',
          params: this.next_params
        })
      } else if (step === '9') {
        this.$router.push({
          name: 'nearfamily',
          params: this.next_params
        })
      }
    },
    nextPage () {
      this.$router.push({
        name: 'houseproperty',
        params: this.next_params
      })
    },
    getBasicPropertyList () {
      var param = {
        'size': 10,
        'pageNo': 1,
        'sort': '',
        'order': ''
      }
      var request_map = Object.assign({}, param, this.family_idInfo)
      var param1 = {
        'request_map': request_map,
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.property_url
      }
      createPostNew(param1).then(res => {
        if (res.data.errcode === 0 && res.data.data.rescode === '0000') {
          this.$Message.success(res.data.data.memo)
          this.data3 = res.data.data.data.propertyInfo
          return
        }
        const content = '<p>' + res.data.data.memo + '</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
      })
    },
    getInfo () {
      var param = {
        'idcardNumber': this.idcardNumber,
        'dictsCode': 'ss11006',
        'serialNumber': this.str
      }
      getAppraising(param).then(res => {
        this.data2 = res.data.data.data
        console.log(res, '基础数据')
        console.log(this.data2)
        // 被赡抚养人
        var param1 = {}
        if (this.itemid === '11210101000000MZJD5212000330000') {
          param1 = {
            'ss11001Id': this.$route.params.ss11001Id,
            'size': 10,
            'pageNo': 1,
            'serialNumber': this.str,
            'idcardNumber': this.idcardNumber,
            'url': this.family_url
          }
        } else if (this.itemid === '11210101000000MZJD5212000351000') {
          param1 = {
            'ss17001Id': this.$route.params.ss17001Id,
            'size': 10,
            'pageNo': 1,
            'serialNumber': this.str,
            'idcardNumber': this.idcardNumber,
            'url': this.family_url
          }
        }
        findFamilyList(param1).then(res => {
          this.dataF1 = res.data.data.data.personInfo
        })
      })
    },
    ok111 (item1) {
      console.log(item1)
      this.paramData.ssbd0009 = date2str(this.paramData.ssbd0009)
      this.paramData.ssbd0010 = date2str(this.paramData.ssbd0010)
      var param = {
        'request_map': this.paramData,
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.url,
        'code': this.$route.params.code,
        'request_step': '6'
      }
      if (this.paramData.ssbd0002 === '' || this.paramData.ssbd0002 === undefined) {
        const content = '<p>请选择财产类型</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
        return
      }
      if (this.paramData.ssbd0005 === '' || this.paramData.ssbd0005 === undefined) {
        const content = '<p>请填写财产总估值</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
        return
      }
      if (this.paramData.ssbd0006 === '' || this.paramData.ssbd0006 === undefined) {
        const content = '<p>请选择是否计入个人收入</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
        return
      }
      if (this.paramData.ssbd0009 === '' || this.paramData.ssbd0009 === undefined) {
        const content = '<p>请选择计入开始时间</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
        return
      }
      if (this.paramData.ssbd0010 === '' || this.paramData.ssbd0010 === undefined) {
        const content = '<p>请选择计入结束时间</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
        return
      }
      createPostNew(param).then(res => {
        if (res.data.errcode === 0 && res.data.data.rescode === '0000') {
          this.$Message.success(res.data.data.memo)
          this.getBasicPropertyList()
          this.modal = false
        } else {
          const content = '<p>' + res.data.data.memo + '</p>'
          this.$Modal.error({
            title: this.errorTitle,
            content: content
          })
        }
      })
    },
    edit (item1) {
      var obj = this.data3[item1]
      // var ss11006Id = obj.id
      var str = obj.id
      var obj1 = {}
      if (this.itemid === '11210101000000MZJD5212000330000') {
        obj1 = {
          'ss11006Id': obj.id
        }
        this.paramData.ss11006Id = obj.id
      } else if (this.itemid === '11210101000000MZJD5212000351000') {
        obj1 = {
          'ss17006Id': obj.id
        }
        this.paramData.ss17006Id = obj.id
      }
      this.modal = true
      var param = {
        'request_map': obj1,
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.info_url
      }
      createPostNew(param).then(res => {
        var a = res.data.data.data
        for (var obj in a) {
          if (a[obj]) {
            this.paramData[obj] = a[obj]
          } else {
            this.paramData[obj] = this.paramData[obj]
          }
        }
        // this.paramData = res.data.data.data
        delete this.paramData.id
        if (res.data.data.code === '200' || res.data.data.rescode === '1000') {
          if (this.itemid === '11210101000000MZJD5212000330000') {
            this.url = 'dbsq/updatePropertyInfo'
            this.paramData.ss11006Id = str
          } else if (this.itemid === '11210101000000MZJD5212000351000') {
            this.url = 'dbbg/updatePropertyInfo'
            this.paramData.ss17006Id = str
          }
        } else {
          if (this.itemid === '11210101000000MZJD5212000330000') {
            this.url = 'dbsq/addPropertyInfo'
          } else if (this.itemid === '11210101000000MZJD5212000351000') {
            this.url = 'dbbg/addPropertyInfo'
          }
        }
        this.$Message.success(res.data.data.memo)
      })
      this.getInfo()
    },
    deletePeople (item1) {
      var obj = this.data3[item1]
      // var ss11006Id = obj.id
      var obj1 = {}
      if (this.itemid === '11210101000000MZJD5212000330000') {
        obj1 = {
          'ss11006Id': obj.id
        }
      } else if (this.itemid === '11210101000000MZJD5212000351000') {
        obj1 = {
          'ss17006Id': obj.id
        }
      }
      var delParam = {
        'request_map': obj1,
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.delete_url,
        'code': this.$route.params.code,
        'request_step': '6',
        'operation_state': 'delete'
      }
      createPostNew(delParam).then(res => {
        this.$Message.success({ title: '', desc: res.data.data.memo })
        this.getBasicPropertyList()
      })
    },
    next () {
      console.log('下一步')
      this.$router.push({
        name: 'houseproperty',
        params: this.next_params
      })
    },
    changePage () {
      // The simulated data is changed directly here, and the actual usage scenario should fetch the data from the server
      this.data3 = this.getBasicPropertyList()
    },
    entry () { // 录入
      this.modal = true
      this.getInfo()
      this.paramData = {
        ssbd0001: '',
        ssbd0002: '',
        ssbd0003: '',
        ssbd0004: '',
        ssbd0005: '',
        ssbd0006: '',
        ssbd0007: '',
        ssbd0008: '',
        ssbd0009: '',
        ssbd0010: ''
      }
      if (this.itemid === '11210101000000MZJD5212000330000') {
        this.url = 'dbsq/addPropertyInfo'
      } else if (this.itemid === '11210101000000MZJD5212000351000') {
        this.url = 'dbbg/addPropertyInfo'
      }
    }
  },
  mounted () {
    if (this.itemid === '11210101000000MZJD5212000330000') {
      this.family_idInfo = {
        'ss11001Id': this.$route.params.ss11001Id
      }
      this.url = 'dbsq/addPropertyInfo'
      this.family_url = 'dbsq/queryPersonInfo'
      this.property_url = 'dbsq/queryPropertyInfo'
      this.info_url = 'dbsq/getPropertyInfo'
      this.delete_url = 'dbsq/delPropertyInfo'
      // this.sq_id = 'dbsq/getSqFamilyDicts'
      this.next_params = {
        serialNumber: this.$route.params.serialNumber,
        idcardNumber: this.$route.params.idcardNumber,
        ss11001Id: this.$route.params.ss11001Id,
        ss11002Id: this.$route.params.ss11002Id,
        code: this.$route.params.code,
        see: this.see,
        itemid: this.itemid,
        order_state: this.order_state
      }
    } else if (this.itemid === '11210101000000MZJD5212000351000') {
      this.family_idInfo = {
        'ss17001Id': this.$route.params.ss17001Id
      }
      this.url = 'dbbg/addPropertyInfo'
      this.family_url = 'dbbg/queryPersonInfo'
      this.property_url = 'dbbg/queryPropertyInfo'
      this.info_url = 'dbbg/getPropertyInfo'
      this.delete_url = 'dbbg/delPropertyInfo'
      // this.sq_id = 'dbbg/getSqFamilyDicts'
      this.next_params = {
        serialNumber: this.$route.params.serialNumber,
        idcardNumber: this.$route.params.idcardNumber,
        ss17001Id: this.$route.params.ss17001Id,
        ss17002Id: this.$route.params.ss17002Id,
        code: this.$route.params.code,
        see: this.see,
        itemid: this.itemid,
        order_state: this.order_state
      }
    }
    // 列表
    this.getBasicPropertyList()
    this.getInfo()
  }
}
</script>
